<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script>
        function f() {
             var count=0;
             var byId = document.getElementById('count');
             var byId1 = document.getElementById('price');
             var byId2 = document.getElementById('num');

            count= byId2.value=parseInt(byId.value)*parseInt(byId1.value)
            alert(count);
            var che = document.getElementById('ab');
            var che1 = document.getElementById('ac');
            var che2 = document.getElementById('ad');
            var che3= document.getElementById('js');
            if (che.checked==true){
                count+=500;
            }   if (che1.checked==true){
                count+=500;
            }   if (che2.checked==true){
                count+=1500;
            }
           if (che3.checked==true){
               var numcount = document.getElementById('numcount');
               numcount.value=count;
           }
        }
    </script>
</head>
<body>
<br>
<div onchange="f()">
    数量:<input type="text" id="count" value="">单价:<input type="text" id="price" value=""><br>
    <br>
    小计:<input type="text" id="num" value="" >
</div>
<br>
<br>
选购项目:
<input type="checkbox" name="yj" id="ab">光驱500元
<input type="checkbox" name="yj" id="ac">硬盘500元
<input type="checkbox" name="yj" id="ad">显示器1500元
<br>
<br>
<br>
<input type="checkbox" name="js" id="js" onload="f()">自动计算
<br><br>
总价:<input type="text" id="numcount" value="">
</body>
</html>